/*
 * @Author: xiaosihan 
 * @Date: 2023-08-05 21:17:11 
 * @Last Modified by: xiaosihan
 * @Last Modified time: 2024-12-30 07:28:45
 */



import { autorun } from "mobx";
import { useEffect, useRef, useState } from "react";
import Preview2D3D from "./Preview2D3D/Preview2D3D";
import styles from "./rightMenu.module.less";
import ToolAnime from "./ToolAnime/ToolAnime";
import ToolClothColor from "./ToolClothColor/ToolClothColor";
import ToolCover from "./ToolCover/ToolCover";
import ToolFontFamily from "./ToolFontFamily/ToolFontFamily";
import ToolFontSpace from "./ToolFontSpace/ToolFontSpace";
import ToolGraffiti from "./ToolGraffiti/ToolGraffiti";
import ToolHorizontalFlip from "./ToolHorizontalFlip/ToolHorizontalFlip";
import ToolLeftRightCover from "./ToolLeftRightCover/ToolLeftRightCover";
import ToolLeftRotation from "./ToolLeftRotation/ToolLeftRotation";
import ToolMatting from "./ToolMatting/ToolMatting";
import ToolMax from "./ToolMax/ToolMax";
import ToolMenu from "./ToolMenu/ToolMenu";
import ToolRepeat from "./ToolRepeat/ToolRepeat";
import ToolReplaceImg from "./ToolReplaceImg/ToolReplaceImg";
import ToolRightRotation from "./ToolRightRotation/ToolRightRotation";
import ToolRotation from "./ToolRotation/ToolRotation";
import ToolTextAlign from "./ToolTextAlign/ToolTextAlign";
import ToolTextBold from "./ToolTextBold/ToolTextBold";
import TooTextlColor from "./ToolTextColor/ToolTextColor";
import ToolTextFontSize from "./ToolTextFontSize/ToolTextFontSize";
import ToolTextStroke from "./ToolTextStroke/ToolTextStroke";
import ToolThreadColor from "./ToolThreadColor/ToolThreadColor";
import ToolUpDownCover from "./ToolUpDownCover/ToolUpDownCover";
import ToolVerticalFlip from "./ToolVerticalFlip/ToolVerticalFlip";
import ToolCropping from "./ToolCropping/ToolCropping";
import ToolRendering from "./ToolRendering/ToolRendering";
import ToolMask from "./ToolMask/ToolMask";
import ToolFontLineHeight from "./ToolFontLineHeight/ToolFontLineHeight";
import ToolFontBend from "./ToolFontBend/ToolFontBend";
import ToolBottomAlign from "./ToolBottomAlign/ToolBottomAlign";
import ToolHorizontalAlign from "./ToolHorizontalAlign/ToolHorizontalAlign";
import ToolLeftAlign from "./ToolLeftAlign/ToolLeftAlign";
import ToolRightAlign from "./ToolRightAlign/ToolRightAlign";
import ToolTopAlign from "./ToolTopAlign/ToolTopAlign";
import ToolVerticalAlign from "./ToolVerticalAlign/ToolVerticalAlign";



interface Iprops {
}

// 右侧菜单
export default function RightMenu() {

  const dom = useRef<HTMLDivElement | null>(null);
  const [data, setData] = useState({});

  useEffect(() => {

  }, []);

  useEffect(() => autorun(() => {
    // const {} = editorStore

  }), []);

  return (
    <div className={styles.rightMenu} >

      {/* 2d3d查看 */}
      <Preview2D3D />

      {/* 工具按钮 */}
      <div className={styles.tool_btns} >
        {/* 衣服的颜色 */}
        <ToolClothColor />
        {/* 缝线颜色组件 */}
        <ToolThreadColor />
        {/* 替换图片 */}
        <ToolReplaceImg />
        {/* 最大化设计 */}
        <ToolMax />
        {/* 铺满工具按钮 */}
        <ToolCover />
        {/* 高度最大化 */}
        <ToolUpDownCover />
        {/* 宽度最大化 */}
        <ToolLeftRightCover />
        {/* 水平翻转 */}
        <ToolHorizontalFlip />
        {/* 上下翻转 */}
        <ToolVerticalFlip />
        {/* 逆时针旋转45° */}
        <ToolLeftRotation />
        {/* 顺时针旋转45° */}
        <ToolRightRotation />

        {/* 左对齐工具 */}
        <ToolLeftAlign />
        {/* 水平对齐工具 */}
        <ToolHorizontalAlign />
        {/* 右对齐工具 */}
        <ToolRightAlign />
        {/* 上对齐工具 */}
        <ToolTopAlign />
        {/* 垂直对齐*/}
        <ToolVerticalAlign />
        {/* 下对齐工具 */}
        <ToolBottomAlign />

        {/* 旋转 */}
        <ToolRotation />

        {/* 文字颜色 */}
        <TooTextlColor />
        {/* 文字字体 */}
        <ToolFontFamily />
        {/* 文字大小 */}
        <ToolTextFontSize />

        {/* 字体描边 */}
        <ToolTextStroke />

        {/* 文字间距 */}
        <ToolFontSpace />
        {/* 文字行高 */}
        <ToolFontLineHeight />
        {/* 文字弯曲 */}
        <ToolFontBend />
        {/* 文字粗体字 */}
        <ToolTextBold />
        {/* 字体对齐方式 */}
        <ToolTextAlign />
        {/* 抠图工具 */}
        <ToolMatting />
        {/* 涂鸦按钮 */}
        <ToolGraffiti />

        {/* 动漫化工具 */}
        <ToolAnime />
        {/* 重复按钮 */}
        <ToolRepeat />
        {/* 裁剪按钮 */}
        <ToolCropping />
        {/* 渲染按钮 */}
        <ToolRendering />
        {/* 遮罩按钮 */}
        <ToolMask />

        {/* <img style={{ width: '100%' }} src={textCoolPNG} alt="" /> */}

        {/* 菜单工具条 */}
        <ToolMenu />


      </div>

    </div>
  );

}